<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>部门管理</title>
  <script src="../../lib/JQuery/jquery-1.11.3.js"></script>
  <script src="../../lib/bootstrap-4.6.1/js/bootstrap.js"></script>
  <link rel="stylesheet" href="../../lib/bootstrap-4.6.1/css/bootstrap.css">
  <link rel="stylesheet" href="../../src/font/department-font/iconfont.css">
  <link rel="stylesheet" href="../../css/department.css">
  <link rel="stylesheet" href="../../css/index.css">
  <style>
  </style>
</head>

<body>
  <!-- 部门管理 -->
  <div class="content">
    <div class="content-son">
      <div class="content-1 ">
        <form class="form-inline">
          <div class="form-group">
            <label for="exampleInputName2"></label>
            <input type="text" class="form-control departmentInput" id="exampleInputName2" placeholder="请输入部门名称">
          </div>

          <button class="btn btn-default departmentButton1 iconfont icon-chaxun" type="submit">&nbsp;查询</button>
        </form>
      </div>
      <div class="content-2">
        <button class="btn btn-default departmentButton2 iconfont icon-xinzeng" data-toggle="modal"
          data-target="#partmentAdd" type="button">&nbsp;新增部门</button>
        <button class="btn btn-default departmentButton3 iconfont icon-daochu" type="button">&nbsp;导出</button>
        <button class="btn btn-default departmentButton3 iconfont icon-daoru" type="button">&nbsp;导入</button>
        <button class="btn btn-default departmentButton3 iconfont icon-shanchu" type="button">&nbsp;删除</button>
      </div>
      <div class="content-3">
        <table class="table" id="table-s">
          <thead>
            <tr>
              <th scope="col"><input type="checkbox">&nbsp;ID</th>
              <th scope="col">&nbsp;部门名称</th>
              <th scope="col">&nbsp;部门编号</th>
              <th scope="col">&nbsp;部门类型</th>
              <th scope="col">&nbsp;机构练习方式</th>
              <th scope="col">&nbsp;地址</th>
              <th scope="col">&nbsp;排序值</th>
              <th scope="col">&nbsp;启用状态</th>
              <th scope="col">&nbsp;操作
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>Otto</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
            </tr>
            <tr>
              <td>Mark</td>
              <td>Otto</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
            </tr>
            <tr>
              <td>Mark</td>
              <td>Otto</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
              <td>@mdo</td>
            </tr>
          </tbody>
        </table>
      </div>


      <!-- 新增 修改 -->
      <div class="modal fade" id="partmentAdd" tabindex="-1" aria-labelledby="partmentAddTitle" aria-hidden="true">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="partmentAddTitle">新增</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
              <form>
                <div class="form-group addPartment-input row">
                  <label for="exampleFormControlSelect1" class="col-3">父级部门:</label>
                  <select class="form-control fatherPartment col-9" id="exampleFormControlSelect1">
                    <option>顶级部门</option>
                    <option>机构1</option>
                    <option>机构2</option>
                  </select>
                </div>
                <div class="form-group row">
                  <label for="exampleFormControlInput1" class="col-3"><span class="star">*</span>&nbsp;部门名称:</label>
                  <input type="email" class="form-control col-9" id="exampleFormControlInput1" placeholder="请输入部门名称" />
                </div>
                <div class="form-group row">
                  <label for="exampleFormControlInput1" class="col-3"><span class="star">*</span>&nbsp;部门编号:</label>
                  <input type="email" class="form-control col-9" id="exampleFormControlInput1" placeholder="请设置部门编号" />
                </div>
                <div class="form-group addPartment-input row">
                  <label for="exampleFormControlSelect1" class="col-3"><span class="star">*</span>&nbsp;部门类型:</label>
                  <select class="form-control col-9" id="exampleFormControlSelect1">
                    <option>医院</option>
                    <option>医院部门</option>
                  </select>
                </div>
                <div class="form-group row">
                  <label for="exampleFormControlInput1" class="col-3">部门地址:</label>
                  <input type="email" class="form-control col-9" id="exampleFormControlInput1"
                    placeholder="请输入部门所处实际地址" />
                </div>
                <div class="form-group row">
                  <label for="exampleFormControlInput1" class="col-3">部门联系方式:</label>
                  <input type="email" class="form-control col-9" id="exampleFormControlInput1"
                    placeholder="name@example.com" />
                </div>
                <div class="form-group row">
                  <label for="exampleFormControlTextarea1" class="col-3">部门备注:</label>
                  <textarea class="form-control col-9" id="exampleFormControlTextarea1" placeholder="请输入部门备注"
                    rows="3"></textarea>
                </div>
              </form>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-secondary" data-dismiss="modal">
                取消
              </button>
              <button type="button" class="btn btn-primary stu-save">
                保存
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>



  <!-- 部门人员信息 -->
  <div class="Department-pi">
    <!-- 第一排div -->
    <div class="Department-pi-1">
      <form class="form-inline">
        <div class="form-group">
          <label for="exampleInputName2"></label>
          <input type="text" class="form-control departmentInput" id="exampleInputName2" placeholder="请输入部门名称">
        </div>
        <button class="btn btn-default departmentButton1 iconfont icon-chaxun" type="submit">&nbsp;查询</button>
      </form>
    </div>
    <!-- table -->
    <div class="Department-pi-2">
      <table class="table table-hover">
        <thead>
          <tr>
            <th><input type="checkbox">&nbsp;</th>
            <th scope="col">ID</th>
            <th scope="col">&nbsp;人员名称</th>
            <th scope="col">&nbsp;人员头像</th>
            <th scope="col">&nbsp;人员性别</th>
            <th scope="col">&nbsp;人员类型</th>
            <th scope="col">&nbsp;职务等级</th>
            <th scope="col">&nbsp;联系方式</th>
            <th scope="col">&nbsp;操作</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th><input type="checkbox">&nbsp;</th>
            <th>1</th>
            <td>Larry</td>
            <td>the</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>新增 删除</td>
          </tr>
          <tr>
            <th><input type="checkbox">&nbsp;</th>
            <th>2</th>
            <td>Larry</td>
            <td>the</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>新增 删除</td>
          </tr>
          <tr>
            <th><input type="checkbox">&nbsp;</th>
            <th>3</th>
            <td>Larry</td>
            <td>the</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>@twitter</td>
            <td>新增 删除</td>
          </tr>
        </tbody>
      </table>
    </div>


    <!-- 分页功能 -->
    <div class="paging Department-paging">
      <span>共1页</span>
      <!-- 下拉 -->
      <div>
      </div>
      <!-- 按钮 -->
      <nav aria-label="Page navigation example">
        <ul class="pagination">
          <li class="page-item">
            <a class="page-link" href="#" aria-label="Previous">
              <span aria-hidden="true">&laquo;</span>
            </a>
          </li>
          <li class="page-item"><a class="page-link" href="#">1</a></li>
          <li class="page-item"><a class="page-link" href="#">2</a></li>
          <li class="page-item"><a class="page-link" href="#">3</a></li>
          <li class="page-item"><a class="page-link" href="#">3</a></li>
          <li class="page-item"><a class="page-link" href="#">3</a></li>
          <li class="page-item">
            <a class="page-link" href="#" aria-label="Next">
              <span aria-hidden="true">&raquo;</span>
            </a>
          </li>
        </ul>
      </nav>
      <!-- 前往第几页 -->
      <div>
        <span>前往</span><span class="yeshu"></span><span>页</span>
      </div>
      <!-- 跳转 -->
      <a href="#">跳转</a>
    </div>
  </div>

  <script>

  </script>
  <script>
    arr.forEach(item => {
      console.log(item)
    });
  </script>
</body>

</html>